<template>
  <div class="space-x-1">
    <n-tag  :round="round" v-for="(item, index) in props.tags" :key="index"
           :type="getRandomType()">
      <TextIcon :tip="tip" icon="icon-park-twotone:tag" :text="item as string" :size="size"></TextIcon>
    </n-tag>
  </div>
</template>

<script setup lang="ts">
import TextIcon from "@/components/pc/icon/TextIcon.vue";

const props = defineProps({
  tags: {
    type: Array,
    default: [],
  },
  tip:{
    type: String,
    default: '标签'
  },
  size:{
    type: Number,
    default: 15
  },
  round:{
    type: Boolean,
    default: false
  }
});
let types = ['success', 'warning', 'error', 'info'];
const getRandomType = (): string => {
  const randomIndex = Math.floor(Math.random() * types.length);
  const randomType = types[randomIndex];
  types.splice(randomIndex, 1);
  return randomType;
};

</script>

<style scoped>

</style>